<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Metamon Market Place</title>
    <!-- demo: https://www.bootcss.com/p/buttons/ -->
    <link rel="stylesheet" type="text/css" href="static/css/buttons.css">
    <link rel="stylesheet" type="text/css" href="static/css/switch.css">
    <link rel="stylesheet" type="text/css" href="static/css/price_limit.css">
    <link rel="stylesheet" type="text/css" href="static/css/echart.css">
    <!-- 引入刚刚下载的 ECharts 文件 -->
    <script src="https://cdn.jsdelivr.net/npm/echarts@5.2.2/dist/echarts.min.js"></script>
    <script src="static/js/echarts_websocket.js"></script>
  </head>
  <body>

    <div id="switch">
      <span class="button-wrap">
        <button id="spider_flag" class="button button-pill button-small" onclick="update_switch('spider_flag')">数据爬取</button>
      </span>
      <p>
        <label>循环爬取等待时间(秒)</label>
        <input id="spider_delay" type="number" onchange="update_switch('spider_delay')">
      </p>
      <textarea id="log_info" rows="5" cols="53">
      </textarea>
    </div>
    <div id="price_limit"></div>
    <!-- 为 ECharts 准备一个定义了宽高的 DOM -->
    <div id="charts">
      <div class="echart" id="total_chart"></div>
      <div class="echart" id="min_chart"></div>
      <div class="echart" id="median_chart"></div>
      <div class="echart" id="max_chart"></div>
      <div class="echart" id="average_chart"></div>
    </div>
  </body>
</html>